<template>
  <div class="homepage fixt">
    <div class="nvebarzxzw nvebarmycollection">
      <!-- <van-nav-bar left-text="最新职位" right-text="更多" @click-right="onClickRight" /> -->

      <span class="zwlbzxzw">我的收藏</span>
    </div>
    <div>
      <div v-if="listnil&&list.length===0">暂无数据</div>
      <van-list v-model="loading" :immediate-check="false" :finished="finished" :offset="10" @load="onLoad">
        <!-- <van-cell v-for="item in list" :key="item" :title="item" /> -->
        <div class="zwlb">
          <ul>
            <li v-for="(item,index) in list" @click="jobdetails(item.id,item.companyId,item.category)"
              :key="index+'wdsc'">
              <div class="zwlbnr">
                <p class="zwlbbt">{{item.name}}</p>
                <p>
                  {{item.workAreaText===''?"地区不限":item.workAreaText}}
                  <span class="zwfg">|</span>
                  {{item.companyName?item.companyName:""}}
                </p>
                <p>
                  <span>{{item.minWage}}~{{item.maxWage}}</span>
                  <span class="zwlbsj">{{item.statusText==="已下线"?item.statusText:item.refreshTime}}</span>
                </p>
              </div>
            </li>
          </ul>
        </div>
      </van-list>
    </div>
  </div>
</template>
<script>
import POSITIONLIST from '@/api/PositionList'
// import timedate from '@/assets/js/datatime'
import { _debounce } from '@/assets/js/public'
export default {
  data () {
    return {
      zw: '',
      loading: false,
      listnil: false,
      pageInfo: {
        page: 1,
        size: 20
      },
      list: [], // 数据存储
      finished: false
    }
  },
  computed: {},
  methods: {
    // 收藏列表
    favoriteList () {
      let that = this
      let condition = [
        {
          column: 'j_job_favorite_id',
          type: '',
          value: ''
        },
        { column: 'include', type: '', value: 'D,CN' }
      ]
      let sort = [{ column: 'refresh_time', type: 'desc' }]
      var formData = new FormData()
      formData.append('page', this.pageInfo.page)
      formData.append('size', this.pageInfo.size)
      formData.append('condition', JSON.stringify(condition))
      formData.append('sort', JSON.stringify(sort))
      formData.append('size', this.pageInfo.size)
      POSITIONLIST.favoriteList(formData).then(res => {
        console.log(res.data)
        that.loading = false
        if (res.data.code === 200) {
          if (!res.data.data.records || res.data.data.records.length === 0) {
            // 加载结束
            that.finished = true
            that.listnil = true
            return
          } else {
            for (let i = 0; i < res.data.data.records.length; i++) {
              let timedata = new Date(
                res.data.data.records[i].refreshTime.replace(/-/g, '/')
              ).getTime()
              timedata = new Date(timedata)
              timedata =
                timedata.getMonth() + 1 + '月' + timedata.getDate() + '日'
              res.data.data.records[i].refreshTime = timedata
            }

            for (let i = 0; i < res.data.data.records.length; i++) {
              that.list.push(res.data.data.records[i])
            }
            that.loading = false
          }

          // 如果列表数据条数>=总条数，不再触发滚动加载
          if (that.list.length >= res.data.data.total) {
            that.finished = true
          }
        } else {
          that.listnil = true
        }
      })
    },
    // 详情跳转
    jobdetails (id, companyId, category) {
      this.$router.push({
        name: 'Jobdetails',
        query: {
          id: id,
          companyId: companyId,
          collect: 3,
          category: category
        }
      })
    },
    // 上拉加载
    onLoad: _debounce(function (_type, index, item) {
      let that = this
      that.loading = false

      // this.loading = false;
      setTimeout(() => {
        that.pageInfo.page++
        that.positionList(that.pageInfo.page)
      }, 100)

      that.favoriteList()
    }, 1000)
  },
  created () {
    this.favoriteList()
  }
}
</script>
<style scoped></style>
